Merge pull request #87 from cantino/quick_navigation

Add quick navigation box for Agents

Andrew Cantino 11 年之前
父节点
当前提交
ca4e71ab5d

+ 26 - 3
app/assets/javascripts/application.js.coffee.erb

@@ -54,7 +54,30 @@ $(document).ready ->
54 54
   if $(".flash").length
55 55
     setTimeout((-> $(".flash").slideUp(-> $(".flash").remove())), 5000)
56 56
 
57
-  # Agent Show
57
+  # Agent Navigation
58
+  $agentNavigate = $('#agent-navigate')
59
+  $agentNavigate.typeahead(
60
+    minLength: 0,
61
+    items: 15,
62
+    source: agentNames
63
+  ).on("change", (e) ->
64
+    if agentPaths[$agentNavigate.val()]
65
+      $('#agent-navigate').closest(".navbar-search").find(".spinner").show();
66
+      window.location = agentPaths[$agentNavigate.val()]
67
+  ).on("focus", (e) ->
68
+    $agentNavigate.val ''
69
+  ).on("blur", (e) ->
70
+    $agentNavigate.val ''
71
+  )
72
+
73
+  # Pressing '/' selects the search box.
74
+  $("body").on "keypress", (e) ->
75
+    if e.keyCode == 47 # The '/' key
76
+      if e.target.nodeName == "BODY"
77
+        e.preventDefault()
78
+        $agentNavigate.focus()
79
+
80
+# Agent Show
58 81
   fetchLogs = (e) ->
59 82
     agentId = $(e.target).closest("[data-agent-id]").data("agent-id")
60 83
     e.preventDefault()
@@ -88,7 +111,7 @@ $(document).ready ->
88 111
 
89 112
   $("#agent_type").on "change", ->
90 113
     if window.jsonEditor?
91
-      $(".spinner").fadeIn();
114
+      $("#agent-spinner").fadeIn();
92 115
       $("#agent_source_ids").select2("val", {});
93 116
       $(".event-descriptions").html("").hide()
94 117
       $.getJSON "/agents/type_details", { type: $(@).val() }, (json) =>
@@ -107,7 +130,7 @@ $(document).ready ->
107 130
         window.jsonEditor.json = json.options
108 131
         window.jsonEditor.rebuild()
109 132
 
110
-        $(".spinner").stop(true, true).fadeOut();
133
+        $("#agent-spinner").stop(true, true).fadeOut();
111 134
 
112 135
   $("#agent_type").change() if $("#agent_type").length
113 136
 

+ 15 - 8
app/assets/stylesheets/application.css.scss.erb

@@ -51,10 +51,6 @@ table.events {
51 51
   margin-left: 0 !important;
52 52
 }
53 53
 
54
-#job-indicator, #event-indicator {
55
-  display: none;
56
-}
57
-
58 54
 img.odin {
59 55
   position: relative;
60 56
   top: -32px;
@@ -91,14 +87,25 @@ span.not-applicable:after {
91 87
   content: "n/a";
92 88
 }
93 89
 
90
+// Navbar
91
+
92
+#job-indicator, #event-indicator {
93
+  display: none;
94
+}
95
+
96
+.navbar-search > .spinner {
97
+  position: absolute;
98
+  top: -1px;
99
+  right: 1px;
100
+}
101
+
94 102
 // Flash
95 103
 
96 104
 .flash {
97 105
   position: fixed;
98
-  width: 500px;
106
+  width: 210px;
99 107
   z-index: 99999;
100
-  top: 1px;
101
-  margin-left: 250px;
108
+  right: 20px;
102 109
 
103 110
   .alert {
104 111
   }
@@ -114,4 +121,4 @@ span.not-applicable:after {
114 121
   &.refresh {
115 122
     margin: 0 10px;
116 123
   }
117
-}
124
+}

+ 1 - 1
app/views/agents/edit.html.erb

@@ -4,7 +4,7 @@
4 4
       <div class="page-header">
5 5
         <h2>
6 6
           Editing your <%= @agent.short_type %>
7
-          <%= image_tag "spinner-arrows.gif", :class => "spinner" %>
7
+          <%= image_tag "spinner-arrows.gif", :class => "spinner", :id => 'agent-spinner' %>
8 8
         </h2>
9 9
       </div>
10 10
 

+ 1 - 1
app/views/agents/new.html.erb

@@ -4,7 +4,7 @@
4 4
       <div class="page-header">
5 5
         <h2>
6 6
           Create a new Agent
7
-          <%= image_tag "spinner-arrows.gif", :class => "spinner" %>
7
+          <%= image_tag "spinner-arrows.gif", :class => "spinner", :id => 'agent-spinner' %>
8 8
         </h2>
9 9
       </div>
10 10
 

+ 8 - 0
app/views/layouts/_navigation.html.erb

@@ -9,11 +9,18 @@
9 9
 
10 10
 <ul class="nav pull-right">
11 11
   <% if user_signed_in? %>
12
+
13
+    <form class="navbar-search pull-left">
14
+      <input type="text" class="search-query" id='agent-navigate' autocomplete="off" placeholder="Search">
15
+      <%= image_tag "spinner-arrows.gif", :class => "spinner" %>
16
+    </form>
17
+
12 18
     <li id='job-indicator'>
13 19
       <a href="/delayed_job">
14 20
         <span class="badge"><i class="icon-refresh icon-white"></i> <span class='number'>0</span></span>
15 21
       </a>
16 22
     </li>
23
+
17 24
     <li id='event-indicator'>
18 25
       <a href="#">
19 26
         <span class="badge"><i class="icon-random icon-white"></i> <span class='number'>0</span> new events</span>
@@ -49,3 +56,4 @@
49 56
     </ul>
50 57
   </li>
51 58
 </ul>
59
+

+ 10 - 0
app/views/layouts/application.html.erb

@@ -32,5 +32,15 @@
32 32
         </div>
33 33
       </div>
34 34
     </div>
35
+
36
+    <script>
37
+      var agentPaths = <%= Utils.jsonify(current_user.agents.inject({}) {|m, a| m[a.name] = agent_path(a) unless a.new_record?; m }) %>;
38
+      agentPaths["All Agents Index"] = <%= Utils.jsonify agents_path %>;
39
+      agentPaths["New Agent"] = <%= Utils.jsonify new_agent_path %>;
40
+      agentPaths["Account"] = <%= Utils.jsonify edit_user_registration_path %>;
41
+      agentPaths["Events Index"] = <%= Utils.jsonify events_path %>;
42
+      var agentNames = [];
43
+      $.each(agentPaths, function(name, v) { agentNames.push(name); });
44
+    </script>
35 45
   </body>
36 46
 </html>

+ 4 - 0
lib/utils.rb

@@ -51,4 +51,8 @@ module Utils
51 51
       result
52 52
     end
53 53
   end
54
+
55
+  def self.jsonify(thing)
56
+    thing.to_json.gsub('</', '<\/').html_safe
57
+  end
54 58
 end